<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>AngularJS scope service</title>
    <script src="../bower_components/angular/angular.min.js"></script>

    <script type="text/javascript">
        angular.module('myapp', [])
            .controller('MyController', ['$scope', function($scope) {
                $scope.myArrayOfPrimitives = [11, 22];
                $scope.myArrayOfObjects = [{num: 101}, {num: 202}];

                $scope.printPrimitives = function() {
                    console.log($scope.myArrayOfPrimitives[0] + '/' + $scope.myArrayOfPrimitives[1]);
                };

                $scope.printObjects = function() {
                    console.log($scope.myArrayOfObjects[0].num+ '/' + $scope.myArrayOfObjects[1].num);
                }
            }])
    </script>
</head>
<body ng-app="myapp">
    <div ng-controller="MyController">
        <ul>
            <li ng-repeat="num in myArrayOfPrimitives">
                <input ng-model="num">
            </li>
        </ul>
        <ul>
            <li ng-repeat="obj in myArrayOfObjects">
                <input ng-model="obj.num">
            </li>
        </ul>

        <button style="margin-left: 20px;" ng-click="printPrimitives()">Print Primitives</button>
        <button style="margin-left: 20px;" ng-click="printObjects()">Print Objects</button>
    </div>
</body>
</html>